<template>
	<view class="contain">


		<view class="bg-color-w padding-lr12 "  v-if="isLogin">
			<view @click="go('/pages/setting/edit')" class="bg-color-w padding-tb12 flex f-j-s f-a-c b-bottom" >


				<view class="flex f-s-0 w-50 h-50 b-radius bg-img margin-r12 b-color-e" :style="user.headImg | bgimg(300)+''"></view>


				<view class="flex flex-1 f-c">
					<view class="f16-size" style="width:400rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{i18n['用户名']}}：{{user.nickname}}</view>
					<view class="margin-t2" style="width:400rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">手机号：{{user.phone | hideCenterText}}</view>
				</view>
				<view class="flex f-s-0">
					<text class="flex f-a-c f-j-c van-icon van-icon-edit t-color-9 f16-size margin-r4"></text>
					<text class="f12-size margin-r4">{{i18n['编辑']}}</text>
					<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
				</view>
			</view>
			<view @click="go('/pages/user/address')" class="bg-color-w  flex f-j-s f-a-c h-50">
				<text class="f15-size">{{i18n['我的收货地址']}}</text>
				<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
			</view>
		</view>

		<!-- <view class="bg-color-w padding-lr12 margin-t12 margin-t12">
			<view @click="go('/pages/user/user_invoice_list/index')" class="  flex f-j-s f-a-c h-50 b-bottom">
				<text class="f15-size">发票管理</text>
				<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
			</view>
			
		</view> -->
<!-- <view v-if="isShow" @click="go('/pages/setting/language')" class="  flex f-j-s f-a-c h-50 ">
				<text class="f15-size">快票历史</text>
				<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
			</view> -->
		<view class="bg-color-w padding-lr12 margin-t12 margin-t12">
			<view @click="go('/pages/setting/safe')" class="  flex f-j-s f-a-c h-50 b-bottom">
				<text class="f15-size">{{i18n['账号与安全']}}</text>
				<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
			</view>
		<!-- 	<view v-if="isShow" @click="go('/pages/setting/language')" class="  flex f-j-s f-a-c h-50 ">
				<text class="f15-size">{{i18n['设置语言']}}</text>
				<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
			</view> -->
		</view>
		<view class="bg-color-w padding-lr12 margin-t12">
		<!-- 	<view class="bg-color-w  flex f-j-s f-a-c h-50 b-bottom">
				<text class="f15-size">{{i18n['清除缓存']}}</text>
				<view class="flex f-a-c">
					<text class="f11-size t-color-9 margin-r4">0k</text>
					<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
				</view>
			</view> -->



			<view  @click="go('/pages/setting/about')" class="bg-color-w  flex f-j-s f-a-c h-50 ">
				<text class="f15-size">{{i18n['关于']}}</text>
				<view class="flex f-a-c">
					<text class="f11-size t-color-9 margin-r4"></text>
					<text class="flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
				</view>
			</view>
		</view>

		<view class="set">
			<view
				class="list-cell b-b"
				:class="{ 'm-t': item.class === 'mT' }"
				v-for="item in setList"
				:key="item.title"
				@tap="navTo(item.url)"
				hover-class="cell-hover"
				:hover-stay-time="50"
			>
				<text class="cell-tit">{{ item.title }}</text>
				<text class="cell-tip">{{ item.content }}</text>
				<text class="cell-more flex f-a-c f-j-c van-icon van-icon-arrow t-color-9 f16-size"></text>
			</view>

			<!-- #ifdef APP-PLUS -->
				<view class="list-cell m-t">
					<text class="cell-tit">是否开启消息推送</text>
					<switch :checked="notifyChecked"  />
				</view>
					<view class="list-cell m-t">
						<text class="cell-tit">是否开启个性化推荐</text>
						<switch :checked="recommendChecked"  />
					</view>
			<!-- #endif -->

		<!-- 	<view
				class="list-cell log-out-btn"
				@tap="toLogout"
			>
				<text class="cell-tit">退出登录</text>
			</view> -->
			<!-- modal -->
			<!-- 选择颜色模态框 -->

		</view>




		<view  v-if="isLogin" @click="toLogout" class="flex f-a-c f-j-c h-50 margin-t12 bg-color-w f-w-500">退出登录</view>

		<view  v-if="isLogin" @click="logoff" class="flex f-a-c f-j-c h-50 margin-t12  f-w-500 t-color-blue1"  style="z-index:999;width:100%;text-align:center">注销账户</view>


	</view>
</template>

<style lang="scss">
page {
	background: $page-color-base;
}
.set {
	padding: $spacing-base 0;
}
.cu-list.card-menu {
	margin: $spacing-base 0;
	.title {
		margin-left: $spacing-base;
	}
}


.list-cell {
	display: flex;
	align-items: baseline;
	padding: 20upx $page-row-spacing;
	line-height: 60upx;
	position: relative;
	background: #fff;
	justify-content: center;

	&.log-out-btn {
		margin: 40upx 0;
		.cell-tit {
			text-align: center;
			margin-right: 0;
		}
	}

	&.cell-hover {
		background: #fafafa;
	}

	&.b-b:after {
		left: 30upx;
	}

	&.m-t {
		margin-top: 16upx;
	}

	.cell-more {
		align-self: baseline;
		font-size: $font-lg;
		color: $font-color-light;
		margin-left: 10upx;
	}

	.cell-tit {
		flex: 1;
		font-size: $font-base + 2upx;
		margin-right: 10upx;
	}

	.cell-tip {
		font-size: $font-base;
		color: $font-color-light;
	}

	switch {
		transform: translateX(16upx) scale(0.84);
	}
}


</style>


<style scoped>
@import url('@/static/css/index/index.css');


</style>
<script>
	// #ifdef APP-PLUS
	import appUpdate  from '@/utils/appUpdate';
	// #endif


	const $ = require('@/utils/api.js');
	let self;
	export default {
		data() {
			return {
				// isLogin:this.$mStore.getters.isLogin,
				isLogin: uni.getStorageSync('token') ? true : false,
				user: '',
				isShow: false,


				isVersionUpgradeShow: false,
				loadProgress: 0,
				CustomBar: this.CustomBar,
				setList: this.$mConstDataConfig.setList,
				styleUserIsOpen: this.$mSettingConfig.styleUserIsOpen,
				notifyChecked: false,
				recommendChecked: false,
				isNewVersion: false,
				colorModal: false,
				themeList: this.$mConstDataConfig.themeList,


			};
		},
		onLoad: function() {
			console.log(this.$mConstDataConfig)
			self = this;
			let config = uni.getStorageSync('config') ? uni.getStorageSync('config') : '';
			if(config != '' && config.language == 'all') {
				self.isShow = true;
			}
		},
		onShow() {
			this.init();

		},
		methods: {

				// 通用跳转
				navTo(route) {
						let _this = this;
					if (!route) return;
					if (route === 'clearCache') {
						uni.showModal({
							content: '确定要清除缓存吗',
							success: e => {
								if (e.confirm) {
									uni.clearStorageSync();
									this.setList[5].content = '0 kb';
									// this.$mStore.commit('login', this.user);
									this.$mHelper.toast('清除缓存成功');
								}
							}
						});
						return;
					} else if (route === 'versionUpgrade') {

							appUpdate();
						// this.isVersionUpgradeShow = true;
						// if (this.isNewVersion) {
						// 	this.$mHelper.toast('已经是最新版本');
						// }
						// return;
						// 	this.appUpdate();
					}else{
							_this.$mRouter.push({ route });
					}

				},
				// 退出登录
				toLogout() {
					uni.showModal({
						content: '确定要退出登录么',
						success: e => {
							if (e.confirm) {


								$.ajax({
									url: 'common/logout',
									data: {
										type: 1,
										username: this.phone,
										code: this.sms,
										registrationId: '', //	极光注册ID
										// cToken: self.$refs.imgCode.code.cToken,
										// captcha: self.code,
									},
									success(res) {
												uni.removeStorageSync('token');
												uni.removeStorageSync('userInfo');
												// $.go('/pages/user/passport/login');
												uni.reLaunch({
													url: '/pages/profile/profile'
												});
									}
								});

								// this.$http.post(`${logout}`).then(() => {
								// 	this.$mStore.commit('logout');
								// 	uni.reLaunch({
								// 		url: '/pages/profile/profile'
								// 	});
								// });
							}
						}
					});
				},
				logoff(){
					console.log("11111111111")
					uni.navigateTo({
						url: '/pages/user/passport/logoff'
					});
				},
				showColorModal() {
					this.colorModal = true;
				},
				SetColor(item) {
					this.colorModal = false;
					this.themeColor = item;
					this.$mStore.commit('setThemeColor', item);
				},
				getUserInfo() {

					self.getUser({
						success(res) {
							// console.log("res",res)
									self.user = res;
						}
					})
				},
				init() {
					this.getUserInfo();
					this.initData()
				},
				// 初始化数据
				initData() {
					// this.user = uni.getStorageSync('user');
					// 缓存大小
					this.setList[0].content = `${uni.getStorageInfoSync().currentSize} kb`;

					// #ifdef APP-PLUS
					// eslint-disable-next-line
					this.setList[1].content = `当前版本 ${plus.runtime.version}`;
					// #endif

				},
		},
		computed: {
			i18n() {
				return this.$t('set')
			},
		},
		created() {
		},
		mounted() {},
		destroyed() {},
		components: {},
		onPullDownRefresh() {
		},
		onReachBottom() {
		}
	}
</script>
